// 引入react
import * as React from 'react';
import {StyleSheet, View, Text, ScrollView,TouchableOpacity} from 'react-native';
import {HeaderTitle} from '../../../../componet/settingComponent/HeaderTitle';
import {SafeAreaView} from 'react-native-safe-area-context';
import AllStyle from '../../../../style';
import {CardItem} from '../../../../componet/settingComponent/CardItem';
import {BottomButton} from '../../../../componet/settingComponent/BottomButton';
import {getEmpPlanClassesList} from '../../../../api/empPlanClasses';
import {Loading} from '../../../../utils/Loading';
import {Toast} from '../../../../utils/Toast';
import {BrLine} from '../../../../componet/settingComponent/BrLine';

/**
 * @Description:
 * @author TangYong
 * @date 2022/12/19
 */
export class SignPlanGroup extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            list: [],
        };
    }

    //生命周期：组件挂载后
    componentDidMount() {
        this.getList();
    }

    getList() {
        let data = {
            page: 1,
            limit: 100,
        };
        Loading.show();
        getEmpPlanClassesList(data).then(res => {
            let {page} = res;
            this.setState({list: page.list});
            Loading.hidden();
        }).catch(err => {
            Loading.hidden();
            Toast.showWarning(err.toString());
        }).finally(()=>{
            Loading.hidden();
        });
    }

    componentDidUpdate(prevProps: Readonly<P>, prevState: Readonly<S>, snapshot: SS) {
        if (this.props.route.params != prevProps.route.params) {
            this.getList();
        }
    }

    //方法
    back = () => {
        this.props.navigation.goBack();
    };
    goto = (name, params) => {

        const route = {
            name: name,
            params: {
                routePathName: this.props.route.name,
                ...params,
            },

        };
        this.props.navigation.navigate(route);
    };

    //DOM
    render() {
        return (
            <SafeAreaView edges={['top', 'left', 'right', 'bottom']} style={{flex: 1, backgroundColor: '#FFF'}}>
                <View style={AllStyle.container}>
                    <HeaderTitle goBack={() => {
                        this.back();
                    }} headtitle={this.props.route.params.title}
                    />

                    <ScrollView style={AllStyle.padding15}>
                        <View style={AllStyle.card}>
                            {this.state.list.map((item, i) => {
                                return (<View key={i}>
                                    <TouchableOpacity onPress={()=>{
                                        this.goto('SaveSignPlanGroup',{
                                            title: '修改考勤方案组',
                                            empPlanClassesId:item.empPlanClassesId
                                        })
                                    }}>
                                        <CardItem  title={item.planName} value={item.sysUserEntity[0].username+'...共'+item.sysUserEntity.length+'人'}></CardItem>
                                    </TouchableOpacity>
                                    <BrLine></BrLine>
                                </View>)
                            })}


                        </View>
                    </ScrollView>
                    <BottomButton title="新增考勤方案组" click={() => {
                        this.goto('SaveSignPlanGroup',{
                            title: '修改考勤方案组',
                            empPlanClassesId:null
                        })
                    }}></BottomButton>
                </View>
            </SafeAreaView>
        );
    }

}

const style = StyleSheet.create({
    //样式
});

